<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>动态更新和删除列表项</title>
    <script type="text/javascript" src="3.js"></script>
    <link rel="stylesheet" href="3.css" type="text/css">
</head>
<body>
<h1>动态列表管理</h1>
<ul id="myList"></ul> <!-- 列表容器 -->
<div class="input-content">
    <input type="text" id="itemInput" placeholder="新项"> <!-- 输入新项内容的输入框 -->
    <button id="addItem">添加项</button> <!-- 添加新项的按钮 -->
</div>

<!-- 模态框，用于编辑列表项 -->
<div id="editModal" class="modal">
    <div class="modal-content">
        <span class="close">&times;</span> <!-- 关闭模态框的按钮 -->
        <h2>编辑项</h2> <!-- 编辑项的标题 -->
        <form id="editForm">
            <input type="text" id="editItemInput" placeholder="编辑内容"> <!-- 编辑内容的输入框 -->
            <button type="submit">保存</button> <!-- 保存编辑内容的按钮 -->
        </form>
    </div>
</div>
</body>
</html>